<style>
    /*样式写这里*/
    .demo-table table tbody tr td span{
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        width:500px;
        display:block;
    }
    
.r {text-align:right;width:30%;}
.l {text-align:left;color:green;}
b {text-align:left;color:red;}
table{margin:10px auto;border-left:1px solid #a2c6d3;border-top:3px solid #0180CF; font-size:12px;width:92%;}
table td{border-right:1px solid #a2c6d3;border-bottom:1px solid #a2c6d3;padding:2px;word-wrap:break-word;word-break:break-all;}
.tt{background:#e5f2fa;line-height:18px;FONT-SIZE:12px;}
    .text-success{
        color:green;
    }
    .text-error{
        color:red;
    }
    /* 分割线 */
    .dividers {
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        -webkit-box-flex: 0;
        flex: 0 1;
        color: #8b95a5;
        font-size: 11px;
        letter-spacing: .5px;
        margin: 2rem auto;
        width: 100%;
    }
    .dividers::before,
    .dividers::after {
        content: '';
        -webkit-box-flex: 1;
        flex-grow: 1;
        border-top: 1px solid #ebebeb;
    }
    .dividers::before {
        margin-right: 16px;
    }
    .dividers::after {
        margin-left: 16px;
    }
    /*字母转大写*/
    .text-uppercase{
        text-transform: uppercase;
    }
    strong{
        color: red;
    }
</style>
<div class="bt-form">
    <div class="bt-w-main">
        <!--菜单部分-->
        <div class="bt-w-menu">
            <p class="bgw" onclick="demo.get_index()">解析查询</p>
            <p onclick="demo.protlist()">相关说明</p>
            <p onclick="demo.about()">关于我们</p>
        </div>
        <!--内容部分-->
        <div class="bt-w-con pd15">
            <div class="plugin_body">
            	
            	<div>
        <!--"DNS_NS","DNS_A","DNS_AAAA","DNS_MX","DNS_CNAME","DNS_SRV" -->
                    
        <select name="tima" class="form-control" id="chatype" >
			<option value="DNS_A">A记录</option>
			<option value="DNS_CNAME">Cname</option>
			<option value="DNS_MX">Mx</option>
			<option value="DNS_AAAA">Aaaa</option>
			<option value="DNS_TXT">Txt</option>
			<option value="GETHOSTBYNAME">Ip记录</option>
			<option value="DNS_NS">Dns</option>
			<option value="DNS_SRV">Srv</option>
		</select>	
                </div>
                
                <div class="input-group">
                    <input type="text" class="form-control" aria-label="..." id="domas" placeholder="填写域名">
                    <div class="input-group-btn">
                        <button class="btn btn-success" type="button" id="chafenba">查询</button>
                    </div>
                </div>


                <div class="form-controlss text-left">
                    <div id="msg"></div>
                </div>
            </div>
            <div class="plugin_aiyaha" style="display: none;">
                <div class="table-responsive">
                    	<strong>主要功能:</strong><br>
可查域名解析的IP，以及A、CNAME、MX、NS、TXT、AAAA、SRV等解析记录。<br>
如果A,CNAME记录没有结果，可以尝试IP记录(gethostbyname方式)。<br>

<strong>仅供参考:</strong><br>
1. 部分解析使用负载均衡或CDN加速等，查询结果仅供参考。<br>
2. 查询结果是服务器所在网络的DNS服务器返回值。<br>

<strong>作用意义:</strong><br>
即时查询域名解析信息（本地不缓存）。<br>
1. A/Cname记录：查询服务器对应DNS服务器解析记录用于判断是否生效。<br>
2. MX：可用于判断邮箱是否有效以减低无效邮箱率。<br>
3. TXT：常用于网站所有者认证,比如腾讯域名邮箱的所有者认证。<br>

                </div>
            </div>

            <div class="plugin_about" style="display: none;">
                <p>作者：Yujianyue	</p>
                <p>主页：<a href="http://12391.net" target="_blank">更多免费查询系统</a></p>
				<p>联系：15058593138(同微信号)</p>
                <p>简介：非计算机专业，10年个人站长，自学asp,php,js,htm,css及服务器维护。</p>
            </div>

        </div>
    </div>
</div>

<!--JS脚本部分，不要将JS脚本写在其它地方-->
<script type="text/javascript">

    //定义窗口尺寸
    $('.layui-layer-page').css({ 'width': '900px' });

    //左测菜单切换效果
    $(".bt-w-menu p").click(function () {
        $(this).addClass('bgw').siblings().removeClass('bgw')
    });

    $("#chafenba").click(function() {
        $('#msg').html("");//重新查询恢复下
        var dist = [];//默认查询
        if ($('#chatype').val()) {
            var strs = new Array();
            var str = $("#chatype").val();
            strs = str.split(".");
            dist = dist.concat(strs);
        }
        query(0, dist);
    });
    $("#domas").keydown(function(e) {
        13 == e.keyCode && $("button").click();
    })
    function query(index, array) {
        var domain = $('#domas').val();
        if(domain == ""){
            return layer.msg('请填写域名');
        }
        if (index < array.length) {
            $('.form-controlss').show();
            var value = array[index];
            request_plugin('yichaxin', 'yichaxin', {ip:domain,callback: 'demo.yichaxin',dk:value }, function (rdata) {
                if (rdata.state == 1001) {
                    $("#msg").append("<p class='text-error'>" + domain + " 域名格式错误或传递失败</p>");
                }else if(rdata.state == 1002) {
                	$("#msg").append("<p class='text-error'>" + domain + " 查询类型获取失败</p>");
                }else if(rdata.state == 1003) {
                	$("#msg").append("<p class='text-error'>" + domain + " 暂未获得解析记录</p>");
                }else if(rdata.state == 1005) {
                	$("#msg").append("<p class='text-error'>" + domain + " 暂未获得解析记录</p>");
                }else{
                    $("#msg").append("<h3 class='text-uccess'>域名<b>" + rdata.ip + "</b>的<b>" + rdata.dk + "</b>解析记录</h3>" + rdata.table);
                }
                if (index < array.length) {
                    query(index + 1, array);
                }
            });
        }else{
            $("#msg").append('<div class="dividers text-uppercase">查询完毕 ['+domain+']</div>');
            layer.msg('查询完毕');
        }
    }
    /**
     * 插件交互对象
     * 您的所有JS代码可以写在里面
     * 若不习惯JS的面向对象编程，可删除此对象，使用传统函数化的方式编写
     * */
     var demo = {
        //构造概览内容
        get_index: function (p) {
            $('.plugin_body').show();
            $('.plugin_aiyaha').hide();
            $('.plugin_about').hide();
            if (p == undefined) p = 1;
            request_plugin('yichaxin', 'getip', { p: p, callback: 'demo.getip' }, function (rdata) {
                $('#domas').val(rdata);
            });
        },

        protlist: function(){
            $('.plugin_body').hide();
            $('.plugin_aiyaha').show();
            $('.plugin_about').hide();
        },

        yichaxin : function (p) {
            if (p == undefined) p = 1;
            request_plugin('yichaxin', 'yichaxin', { p: p, callback: 'demo.yichaxin' }, function (rdata) {
                $('.plugin_body').html("<pre>"+rdata+"</pre>");
            });
        },

        about : function(){
            $('.plugin_body').hide();
            $('.plugin_aiyaha').hide();
            $('.plugin_about').show();
        }

    }

    /**
     * 发送请求到插件
     * 注意：除非你知道如何自己构造正确访问插件的ajax，否则建议您使用此方法与后端进行通信
     * @param plugin_name    插件名称 如：demo
     * @param function_name  要访问的方法名，如：get_logs
     * @param args           传到插件方法中的参数 请传入数组，示例：{p:1,rows:10,callback:"demo.get_logs"}
     * @param callback       请传入处理函数，响应内容将传入到第一个参数中
     */
     function request_plugin(plugin_name, function_name, args, callback, timeout) {
        if (!timeout) timeout = 3600;
        $.ajax({
            type:'POST',
            url: '/plugin?action=a&s=' + function_name + '&name=' + plugin_name,
            data: args,
            timeout:timeout,
            success: function(rdata) {
                if (!callback) {
                    layer.msg(rdata.msg, { icon: rdata.status ? 1 : 2 });
                    return;
                }
                return callback(rdata);
            },
            error: function(ex) {
                if (!callback) {
                    layer.msg('请求过程发现错误!', { icon: 2 });
                    return;
                }
                return callback(ex);
            }
        });
    }

    //第一次打开窗口时调用
    demo.get_index();

</script>